<template>
	<view>
		<view class="content">
			<smh-countDown ref="countDown" :second="second" :radius="400" class="cir" :fontSize="40" :lineWidth="5"
				@end="end">
			</smh-countDown>

		</view>
		<view class="text-box" scroll-y="true">
			<text>{{text}}</text>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title: 'Hello',
				second: 10,
				text: ''
			}
		},
		onLoad() {

		},
		onShow() {
			this.end();
		},
		methods: {
			end() {
				var that = this
				uni.request({
					url: getApp().globalData.baseUrl + '/api/system/totp',
					header: {
						Authorization: "Bearer " + localStorage.getItem('accessToken'),
						"X-Authorization": "Bearer " + localStorage.getItem('refreshToken'),
					},
					method: 'GET',
					success: (res) => {
						if (res.statusCode == 401) {
							uni.navigateTo({
								url: '/pages/login/login'
							});
						}
						if (res.data.statusCode == 200) {
							this.second = res.data.data.countDown
							this.text = res.data.data.totpPwd
						} else {
							uni.showToast({
								title: res.data.errors,
								icon: 'error',
								mask: true,
								duration: 1000
							});
						}
					}
				})
			},
		}
	}
</script>

<style scoped>
	.content {
		display: flex;
		justify-content: center;
		padding-top: 25px;
	}

	.text-box {
		margin-bottom: 20px;
		padding: 20px 0;
		display: flex;
		min-height: 150px;
		background-color: #fff;
		justify-content: center;
		align-items: center;
		text-align: center;
		font-size: 55px;
		color: #aa0000;
		line-height: 1.8;
	}

	.cir {
		color: #0A84FF;
		bgcolor: #f2f2f2;
	}
</style>
